<template>
  <div class="zlst-tabel">
    <el-table :data="data" v-bind="$attrs" v-on="$listeners">
      <template v-for="(column, index) in columns">
        <!-- slot 添加自定义配置项 -->
        <slot v-if="column.slot" :name="column.slot" />
        <!-- 可定义组件 -->
        <!-- <component :key="index" v-else-if="column.component" :is="config.component" :col-config="column">
        </component> -->
        <!-- 默认情况下使用原始组件 el-tabel-column -->
        <el-table-column v-else :key="`zlst-table${index}`" v-bind="column">
          <template slot-scope="{ row }">
            {{ row[column.prop] || row[column.prop] === 0 ? row[column.prop] : '-' }}
          </template>
        </el-table-column>
      </template>
    </el-table>
  </div>
</template>
<script>
export default {
  name: 'ZlstTableComponent',
  props: {
    // [
    //   { prop: "name", label: "名称" },
    //   { slot: 'action' }
    // ]
    columns: { // 表格配置项 列
      type: Array,
      default: () => []
    },
    data: { // 表格数据
      type: Array,
      default: () => []
    }
  }
}
</script>
